<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="./index.css">
    <script src="index.js"></script>
    <title>title</title>
</head>
<body>
    <div class="container">
        <div class="head">
            <div class="left"><</div>
            <div class="title">新增地址</div>
        </div>
        <form id="content" method="post">
            <div class="main" id="main">
                <ul>
                    <li>收货人姓名</li>
                    <li><input type="text" value="请输入姓名" id="name"></li>
                </ul>
                <ul>
                    <li>手机号码</li>
                    <li><input type="text"  required="required" value="请输入手机号码" pattern="1[3,5,7,8,9]{1}[0-9]{9}"></li>
                </ul>
                <ul>
                    <li>所在地区</li>
                    <li>
                        <input type="text" id="city" class="city">
                        <i id="drop"></i>
                    </li>
                </ul>
                <ul>
                    <li>街道地址</li>
                    <li><input type="text" value="请输入街道地址" ></li>
                </ul>
                <ul>
                    <li>邮政编码</li>
                    <li><input type="text" required="required" pattern="[0-9]{6}"></li>
                </ul>
            </div>
            <div class="address">
                <ul>
                    <li id="defaults"></li>
                    <li>设为默认地址</li>
                </ul>
            </div>
            <div class="foot">
                <input type="submit" value="保存" id="btn">
            </div>
        </form>
        <div class="areas" id="areas">
            <div class="area">
            <div class="area_title">
                <h4>所在地区</h4>
                <rem id="fork">×</rem>
            </div>
            <div class="area_choose">
                <span>请选择</span>
                <i></i>
            </div>
            <div class="items">
                <div class="item">北京</div>
                <div class="item">天津</div>
                <div class="item">河北</div>
                <div class="item">山西</div>
                <div class="item">内蒙古</div>
                <div class="item">辽宁</div>
                <div class="item">吉林</div>
                <div class="item">湖北</div>
                <div class="item">新疆</div>
                <div class="item">维吾尔</div>
                <div class="item">陕西</div>
                <div class="item">河南</div>
                <div class="item">湖南</div>
                <div class="item">上海</div>
            </div>
        </div>
        </div>
    </div>
</body>
</html>